import api from './api.js';

const { createApp } = Vue;

createApp({
    data() {
        return {
            userType: 'client', // client 或 therapist
            loginForm: {
                phone: '',
                password: '',
                remember: false
            },
            loading: false,
            errorMessage: '',
            showPassword: false
        };
    },
    methods: {
        goToPage(page) {
            switch (page) {
                case 'index':
                    window.location.href = 'index.html';
                    break;
                case 'consultation':
                    window.location.href = 'consultation.html';
                    break;
                case 'therapist':
                    window.location.href = 'therapist.html';
                    break;
                case 'about':
                    window.location.href = 'about.html';
                    break;
                case 'user-center':
                    window.location.href = 'user-center.html';
                    break;
                case 'login':
                    window.location.href = 'login.html';
                    break;
            }
        },
        goToRegister() {
            window.location.href = `register.html?type=${this.userType}`;
        },
        togglePasswordVisibility() {
            this.showPassword = !this.showPassword;
        },
        clearError() {
            this.errorMessage = '';
        },
        handleLogin() {
            if (!this.validateForm()) {
                return;
            }

            this.loading = true;
            this.clearError();

            // 模拟API调用
            setTimeout(() => {
                // 这里应该调用后端API进行登录验证
                console.log('登录信息：', {
                    type: this.userType,
                    ...this.loginForm
                });

                // 模拟登录成功
                if (this.loginForm.phone === '13800138000' && this.loginForm.password === '123456') {
                    // 保存登录状态
                    localStorage.setItem('token', 'mock_token');
                    localStorage.setItem('userType', this.userType);
                    localStorage.setItem('phone', this.loginForm.phone);

                    if (this.loginForm.remember) {
                        localStorage.setItem('rememberLogin', 'true');
                        localStorage.setItem('savedPhone', this.loginForm.phone);
                    } else {
                        localStorage.removeItem('rememberLogin');
                        localStorage.removeItem('savedPhone');
                    }

                    // 根据用户类型跳转到不同页面
                    if (this.userType === 'client') {
                        window.location.href = 'user-center.html';
                    } else {
                        window.location.href = 'therapist/index.html';
                    }
                } else {
                    this.errorMessage = '手机号或密码错误';
                }
                this.loading = false;
            }, 1000);
        },
        validateForm() {
            this.clearError();

            if (!this.loginForm.phone) {
                this.errorMessage = '请输入手机号码';
                return false;
            }

            const phoneRegex = /^1[3-9]\d{9}$/;
            if (!phoneRegex.test(this.loginForm.phone)) {
                this.errorMessage = '请输入正确的手机号码';
                return false;
            }

            if (!this.loginForm.password) {
                this.errorMessage = '请输入密码';
                return false;
            }

            if (this.loginForm.password.length < 6) {
                this.errorMessage = '密码长度不能少于6位';
                return false;
            }

            return true;
        }
    },
    created() {
        // 检查是否记住登录
        if (localStorage.getItem('rememberLogin') === 'true') {
            this.loginForm.phone = localStorage.getItem('savedPhone') || '';
            this.loginForm.remember = true;
        }
    }
}).mount('#app'); 